<!DOCTYPE html>
<html lang="en">

<head>
    <title>详情</title>
    <#include "/toupiao/components/meta.html" />
    <#include "/toupiao/components/stylesheets.html" />
    <link href="https://cdn.bootcss.com/layer/3.1.0/theme/default/layer.css" rel="stylesheet">
    <link rel="stylesheet" href="/toupiao/stylesheets/info.css?v=3">
</head>

<body>
    <div id="app">
        <#assign scrollingText = activity.notification! />
        <#include "/toupiao/components/scrolling.html" />
        <div data-am-widget="slider" class="am-slider am-slider-a1 slider1" data-am-slider='{&quot;directionNav&quot;:false}' >
            <ul class="am-slides">
                <#if info.logoList??>
                    <#list info.logoList as logo>
                        <li>
                            <div class="img-container fillimg">
                                <img src="${logo}" />
                            </div>
                        </li>
                    </#list>
                </#if>
            </ul>
        </div>
        <div class="info">
            <div class="info-title am-text-center">
                <img src="${info.cover!}" class="am-circle" />
                <span>${info.title!}</span>
            </div>
            <ul class="am-avg-sm-4 info-status am-text-center">
                <li>
                    <div><i class="am-icon-user"></i>&nbsp;选手编号</div>
                    <div>${info.no!}号</div>
                </li>
                <li>
                    <div><i class="am-icon-thumbs-o-up"></i>&nbsp;当前票数</div>
                    <div id="votes">${info.vote!}票</div>
                </li>
                <li>
                    <div><i class="am-icon-star"></i>&nbsp;当前排名</div>
                    <div>第${info.position!}名</div>
                </li>
                <li>
                    <div><i class="am-icon-star"></i>&nbsp;距上一名</div>
                    <div>差${info.nextVote!}票</div>
                </li>
            </ul>
        </div>
        <div class="content">
            <div class="content-top">
                <div class="content-top-title">
                    <div class="theme-background-color-1 theme-color-1"><i class="am-icon-user"></i>&nbsp;参赛店铺信息</div>
                    <div>店铺地址：${info.address!}</div>
                </div>
                <div class="content-top-info">
                    <#-- <div data-am-widget="slider" class="am-slider am-slider-a1 content-top-info-slider slider2" data-am-slider='{&quot;directionNav&quot;:false}' >
                        <ul class="am-slides">
                            <#if info.imageList??>
                                <#list info.imageList as img>
                                    <li>
                                        <div class="img-container fillimg">
                                            <img src="${img!}">
                                        </div>
                                    </li>
                                </#list>
                            </#if>
                        </ul>
                    </div> -->
                    <img src="${info.cover!}" />
                </div>
            </div>
            <div class="content-detail">
                <div class="content-detail-top">
                    <span><i class="am-icon-file"></i>&nbsp;详情</span>
                </div>
                <div class="content-detail-info">
                    <!-- <span>${info.content!}</span> -->
                    <#if info.imageList??>
                        <#list info.imageList as img>
                            <div class="content-detail-gallery">
                                <img src="${img!}">
                            </div>
                        </#list>
                    </#if>
                </div>
            </div>
        </div>
        <div class="bottom">
            <div class="bottom-background"></div>
            <div class="am-g">
                <div class="am-u-sm-4">
                    <a href="javascript:" class="am-btn am-btn-default bottom-button" role="button" id="vote">
                        <span class="bottom-button-icon"><i class="am-icon-heart-o"></i></span>&nbsp;给Ta投票
                    </a>
                </div>
                <div class="am-u-sm-4">
                    <a href="/toupiao/dimond/?code=${(activity.code)!}&joinCode=${(info.code)!}" class="am-btn am-btn-default bottom-button" role="button">
                        <span class="bottom-button-icon"><i class="am-icon-diamond"></i></span>&nbsp;买钻
                    </a>
                </div>
                <div class="am-u-sm-4">
                    <a href="/toupiao/join/${(activity.code)!}" class="am-btn am-btn-default bottom-button" role="button">
                        <span class="bottom-button-icon"><i class="am-icon-users"></i></span>&nbsp;我要报名
                    </a>
                </div>
            </div>
        </div>
        <div class="bottom-copyright">
            <a href="http://www.zhen-yee.com/">此网站由 蓁奕互联网科技有限公司 开发</a>
        </div>
        <#include "/toupiao/components/footer.html" />
    </div>
    <#include "/toupiao/components/scripts.html" />
    <#include "/toupiao/components/wxConfig.html" />
    <script src="https://cdn.bootcss.com/layer/3.1.0/layer.js"></script>
    <script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
    <script type="text/javascript">
    var app = new Vue({
        el: '#app',
        data: {
        },
        methods: {
        }
    })
    wx.ready(function() {
        var title = "${activity.shareTitle!}";
        var desc = "${activity.shareDesc!}";
        var link = "${host}/toupiao/info/${info.code!}";
        var imgUrl = "${activity.shareImage!}";
        initWXShareAll(title, desc, link, imgUrl);
    });
    </script>
    <script>
    $(document).ready(function() {
        $("#vote").click(function() {
            axios.get('/toupiao/vote/' + '${info.code!}')
                .then(function(response) {
                    if (response.data.status == 200) {
                        // $("#votes").text(response.data.info + "票");
                        //layer.msg("投票成功");
                        window.location.href = "/toupiao/voteResult/${(activity.code)!}";
                    } else {
                        layer.msg("投票失败：" + response.data.msg);
                        console.log(response);
                    }
                })
                .catch(function(error) {
                    layer.msg("投票失败：" + error);
                    console.log(error);
                });
            // window.location.href = "/toupiao/vote/${info.code!}";
        })
        if ("${isExpired!}" == "1") {
            layer.open({
                content: '活动已结束',
                btn: '确定'
            });
        }
    })
    </script>
</body>

</html>